<%@ page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="/WEB-INF/customTag.tld" prefix="ct"%>

<c:import url="/inc/header.jsp" />
<c:import url="/inc/menu.jsp" />
<c:import url="/inc/content-begin.jsp" />

<div class="head">
	<div class="info">
		<h1>Aide</h1>
		<ul class="breadcrumb">
			<li class="active">L'integralité de l'aide disponible pour utiliser Magesti.</li>
		</ul>
	</div>
</div>
<div class="content">
<c:import url="/inc/alert-ie.jsp" />
	<!-- <div class="row-fluid">
		<div class="span12">
			<div class="block">
				<div class="head">
					<h2>Test</h2>
					<ul class="buttons">
						<li><a href="#" class="block_toggle"><span
								class="i-arrow-down-3"></span></a></li>
						<li><a href="#" class="block_remove"><span
								class="i-cancel-2"></span></a></li>
					</ul>
				</div>
				<div class="content np">
					<c:forEach items="${aide.sections}" var="section">
				S: ${section.titre} 
				<c:forEach items="${section.listeQr}" var="qr">
							<p>Q: ${qr.question} R: ${qr.reponse}</p>
						</c:forEach>
					</c:forEach>
				</div>
				<div class="footer">
					<div class="side fr"></div>
				</div>
			</div>
		</div>
	</div> -->

	<div class="row-fluid">
		<div class="span12">
			<div class="block">
				<div class="head" id="sommaire">
					<h2>Sommaire.</h2>
					<ul class="buttons">
						<li><a href="#" class="block_toggle"><span
								class="i-arrow-down-3"></span></a></li>
						<li><a href="#" class="block_remove"><span
								class="i-cancel-2"></span></a></li>
					</ul>
				</div>
				<div class="content np">
					<div class="controls-row">
						<div class="span12">

							<a href="#Introduction"></a>Voici les thèmes abordés par l'aide
							de Magesti:
						</div>
						<c:forEach items="${aide.sections}" var="section">
							<div class="span12">
								<a href="#${section.titre}"> -${section.titre}</a>
							</div>
						</c:forEach>
					</div>
				</div>
				<div class="footer">
					<div class="side fr"></div>
				</div>
			</div>
		</div>
	</div>

	<c:forEach items="${aide.sections}" var="section">
		<div class="row-fluid">
			<div class="span12">
				<div class="block">
					<div class="head" id="${section.titre}">
						<h2>${section.titre}</h2>
						<ul class="buttons">
							<li><a href="#" class="block_toggle"><span
									class="i-arrow-down-3"></span></a></li>
							<li><a href="#" class="block_remove"><span
									class="i-cancel-2"></span></a></li>
						</ul>
						<!-- Si c'est possible, utiliser sample_faq.html lorsque le JavaScript fonctionnera à nouveau -->
					</div>
					<!-- <div class="content np"> -->
					<div class="content np">
						<c:forEach items="${section.listeQr}" var="qr">
							<div class="controls-row">
								<strong>${qr.question}</strong>
								<div class="well well-small">${qr.reponse}</div>
							</div>
						</c:forEach>
					</div>
					<div class="footer">
					<div class="side fr"><a href="#sommaire">Revenir en haut de la page</a></div>
				</div>
				</div>
			</div>
		</div>
	</c:forEach>
</div>
<c:import url="/inc/content-end.jsp" />
<c:import url="/inc/footer.jsp" />